import React, { PureComponent } from 'react'

import {
  TouchableWithoutFeedback,
  View,
  Text,
  StyleSheet,
  Image
} from 'react-native'

export default class DispensePatientCell extends PureComponent {
  _onPress = () => {
    // this.props.onPressItem(this.props.id)
  }

  render() {
    return (
      <TouchableWithoutFeedback onPress={this._onPress}>
        <View style={styles.container}>
          <View style={{ width: 100, height: 100, padding: 10 }}>
            <Image
              resizeMode="stretch"
              source={require('./src/2e515611327925ef332b71e7d1377678.jpg')}
              style={{ width: 80, height: 80 }}
            />
          </View>
          <View
            style={{
              flex: 1,
              flexDirection: 'row',
              paddingTop: 10,
              paddingBottom: 5
            }}
          >
            <View style={{ flex: 2 }}>
              <View style={{ flex: 1 }}>
                <Text style={{ color: '#333', fontSize: 16 }}>
                  {this.props.name}
                </Text>
              </View>
              <View style={{ flex: 1 }}>
                <Text style={{ color: '#333', fontSize: 16 }}>
                  {this.props.sex}/{this.props.age + '  '}
                  <Text style={{ color: '#a14545' }}>
                    {this.props.nurseLevel}
                  </Text>
                </Text>
              </View>
              <View style={{ flex: 1 }}>
                <Text style={{ color: 'red', fontSize: 14 }}>
                  {this.props.allergy}
                </Text>
              </View>
            </View>
            <View style={{ flex: 1 }}>
              <View style={{ flex: 1, justifyContent: 'center' }}>
                <Text style={{ fontSize: 14 }}>{this.props.bed}</Text>
              </View>
              <View style={{ flex: 1, justifyContent: 'center' }}>
                <Text style={{ color: 'green', fontSize: 16 }}>
                  {this.props.stateStr ? this.props.stateStr : '已完成'}
                </Text>
              </View>
            </View>
          </View>
        </View>
      </TouchableWithoutFeedback>
    )
  }
}

const styles = StyleSheet.create({
  container: {
    width: screenWidth,
    height: 100,
    flexDirection: 'row',
    backgroundColor: 'white'
  }
})
